<!--
 * @Author: your name
 * @Date: 2021-04-10 23:00:22
 * @LastEditTime: 2021-05-03 22:55:55
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \ws-shop\src\views\AfterSale.vue
-->
<template>
  <div class="aftersale">
    <ul>
        <li>
          <van-cell is-link @click="showPay">支付问题</van-cell>
          <van-popup v-model="show1" round position="bottom" :style="{ height: '50%'}">
            Q1：在线支付订单取消后,钱怎么返还? *使用美购账户余额支付(包括:余额、余额+红包) ,订单无效后,所有款项(包括红包)将退到您的个人人账户;使用第三方支付(包括:第三方支付、第三方支付+红包) ,订单无效后,支付款项将于2个工作日内返还到您的第三方支付账户,红包退还到账户。
            <br/>在线支付的过程中,订单显示未支付成功,款项却被扣了,怎么办? *该问题属于第三方(银行/支付宝/微信等)数据传输延迟问题。您可以再等待一下,如果超过半个小时,订单还是未支付状态,第三方会把款项返还到您的付款账户。具体到账时间依银行而定,一般会在2个工作日内。
            <br/>为什么提示下单次数过多，无法下单？ *在24小时内，同一手机号在同一设备上最多可以成功提交7次订单。
          </van-popup>
        </li>
        <li>
          <van-cell is-link @click="showstore">商家代金券</van-cell>
          <van-popup v-model="show4" round position="bottom" :style="{ height: '25%'}">
            Q1:什么是商家代金券? *商家代金券是指由商家自己发放代金券，只限在指定的商家使用，可根据条件抵扣相应金额。
            <br/>Q2:商家代金券使用条件 *商家代金券仅限在指定商家使用 *每个订单只能使用一张商家代金券，不可与其他代金券叠加使用。
          </van-popup>
        </li>
        <li>
          <van-cell is-link @click="showPre">优惠问题</van-cell>
          <van-popup v-model="show2" round position="bottom" :style="{ height: '50%'}">
            Q1：红包如何使用？ *红包优惠仅限订单选择在线支付时使用；每个订单限用一个红包，每天最多可用2个红包优惠。每个红包只能使用一次，不能叠加或拆分使用。红包如果设有使用金额门槛，则购物车金额需满足金额门槛才可使用。红包如果有品类、商家、手机号或时段限制，订单需要满足对应条件才可使用。
            <br/>Q2：下单时使用红包，但是后来订单取消了，红包会返还吗？ *会的，订单无效后红包会自动返还到账户。
            <br/>Q3：首单红包使用条件？ *新用户（设备、手机号、美购商城账号、支付账号均未在美购商城下过单）首次下单。仅限在线支付使用。首单红包不与其他优惠同享。
          </van-popup>
        </li>
        <li>
          <van-cell is-link @click="showfree">免责声明</van-cell>
          <van-popup v-model="show3" round position="bottom" :style="{ height: '30%'}">
            新用户是根据设备、美购账号、下单手机号进行判断，如果您下单时以上信息均为首次使用则符合美购商城定义的新用户 *仅限新用户使用移动端app提交订单并选择在线支付时享受 *在本设备上曾经有过购买记录行为的手机不能参加本活动 *新用户首单立减金额各区域不同 *活动仅支持手机客户端最新版本
          </van-popup>
        </li>
      </ul>
  </div>
</template>

<script>
export default {
  data () {
    return {
      show1: false,
      show2: false,
      show3: false,
      show4: false
    }
  },
  methods: {
    showPre () {
      this.show2 = true
    },
    showPay () {
      this.show1 = true
    },
    showfree () {
      this.show3 = true
    },
    showstore () {
      this.show4 = true
    }
  }
}
</script>

<style lang="scss" scoped>
ul {
  li {
    list-style: none;
    align-items: center;
    height: 50px;
    margin-bottom: 2px;
    .van-cell {
      width: 100%;
      height: 100%;
      line-height: 30px;
      background-color: rgba($color: #fff, $alpha: 0.4);
    }
    .van-popup {
      box-sizing: border-box;
      padding:20px;
      text-align: center;
    }
  }
}
</style>
